import axios from "axios";
import store from "@/store";
import { Message } from "element-ui";
import router from "@/router";
// import { ElMessageComponent } from "element-ui/types/message";
// 创建一个axios实例
const service = axios.create({
  baseURL: "https://api-hmzs.itheima.net/v1", //若对接多个接口，把这里换成变量即可
  timeout: 5000, // request timeout
});

// 请求拦截器
service.interceptors.request.use(
  (config) => {
    // config携带的是请求信息，必须有return 否则不会发起请求
    // 通常用来配置请求头，携带token
    const token = store.state.user.token;
    // Authorization和后端对应
    if (token) {
      config.headers.Authorization = token;
    }
    return config;
  },
  (error) => {
    // 执行时机：请求发生错误的时候
    return Promise.reject(error);
  }
);

// 响应拦截器 在后端返回数据的时候触发。数据流转的第一站
service.interceptors.response.use(
  // 执行时机：正确响应
  (response) => {
    console.log(response, 888);
    // 拿到后端的原始数据
    // 如果响应的的标号不是10000，说明失败了，返回一个失败的promise
    if (response.data.code !== 10000) {
      // 添加错误提示是因为让try... catch的时候可以捕获到异常
      Message.error(response.data.msg);
      return Promise.reject(response.data.msg);
    }
    return response.data;
  },
  (error) => {
    // 执行时机：响应错误的时候，状态码不是2xx和3xx
    // 可以做统一的错误处理
    // 判断token是否过期
    if (error?.response.status == 401) {
      // 清除token
      store.commit("user/removeToken");
      // 跳转到登录页面
      router.push("/login");
    }
    Message.error(error.response.data.msg);
    return Promise.reject(error);
  }
);
export default service;
